<template>
    <el-card class="box-card" >

        <el-form :inline="true" :model="formInline" class="demo-form-inline" label-width="180px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="学校名称">
                        <el-input v-model="formInline.SCHOOL_NAME" placeholder="学校名称"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="所在州">
                        <el-input v-model="formInline.SCHOOL_CITY" placeholder="所在州"></el-input>
                    </el-form-item>
                </el-col>

            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="学校网址">
                        <el-input v-model="formInline.SCHOOL_WEB" placeholder="学校网址"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="学校地址">
                        <el-input v-model="formInline.SCHOOL_ADDRESS" placeholder="学校地址"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="邮箱">
                        <el-input v-model="formInline.SCHOOL_EMIAL" placeholder="邮箱"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="电话">
                        <el-input v-model="formInline.SCHOOL_TEL" placeholder="电话"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">

                    <el-form-item label="推荐购买力众保险套餐">
                        <el-input v-model="formInline.SCHOOL_PRODUCE" placeholder="推荐购买力众保险套餐"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="学校推荐保险价格">
                        <el-input v-model="formInline.SCHOOL_CONTENT" placeholder="学校推荐保险价格"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-form-item label="学校对保险特殊要求">
                <el-input type="textarea" v-model="formInline.SCHOOL_REQUIRE"></el-input>
            </el-form-item>
            <el-form-item label="附件下载" v-if="type=='修改' ">
                <el-button type="primary" class="fileselect" @click="download">
                    下载附件
                </el-button>
            </el-form-item>
            <el-form-item label="附件上传" v-if="type=='新增'">
                <el-button type="primary" class="fileselect">
                    <input type="file" @change="upload" value="" id="fileup"> 上传附件
                </el-button>
            </el-form-item>
            <el-form-item label="重新上传"  v-if="type=='修改'">
                <el-button type="primary" class="fileselect">
                    <input type="file" @change="upload" value="" id="fileup"> 上传附件
                </el-button>
            </el-form-item>
            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span style="line-height: 36px;">推荐医生</span>
                    <el-button type="primary" class="fileselect" style="float:right" @click="doctorChoose">
                        新增
                    </el-button>
                </div>

                <doctor-list :type="'学校查看'" :data="doctor" ref="doctorList" @goDelectDoctor="goDelectDoctor">
                </doctor-list>
            </el-card>
            <div class="space20">
            </div>

            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span style="line-height: 36px;">推荐医院</span>
                    <el-button type="primary" class="fileselect" style="float:right" @click="hospitalChoose">
                        新增
                    </el-button>
                </div>

                <hospital-list :type="'学校查看'" :data="hospital" ref="hospitalList" @goDelectHospital="goDelectHospital">
                </hospital-list>
            </el-card>
            <div class="space20">
            </div>

            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span style="line-height: 36px;">推荐药房</span>
                    <el-button type="primary" class="fileselect" style="float:right" @click="pharmacyChoose">
                        新增
                    </el-button>
                </div>

                <pharmacy-list :type="'学校查看'" :data="pharmacy" ref="PharmacyList" @goDelectPharmacy="goDelectPharmacy">
                </pharmacy-list>
            </el-card>
            <div class="space20">
            </div>

            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span style="line-height: 36px;">推荐急救中心</span>
                    <el-button type="primary" class="fileselect" style="float:right" @click="SAMUChoose">
                        新增
                    </el-button>
                </div>

                <SAMU-list :type="'学校查看'" :data="samu" ref="SAMUList" @goDelectSamu="goDelectSamu">
                </SAMU-list>
            </el-card>
            <div class="space20">
            </div>

            <div style="text-align:center">
                <el-button type="primary" v-if="type=='修改'" @click="onChange">修改</el-button>
                <el-button type="primary" v-else @click="onAdd">新增</el-button>
            </div>

        </el-form>
        <el-dialog title="选择医院" :visible.sync="hospitalGet" v-if="hospitalGet" :modal="false" top="30%">
            <hospital-list-multiple @SelectHospital="SelectHospital">
            </hospital-list-multiple>

        </el-dialog>
        <el-dialog title="选择医生" :visible.sync="doctorGet" v-if="doctorGet" :modal="false">
            <doctor-list-multiple @SelectDoctor="SelectDoctor">
            </doctor-list-multiple>
        </el-dialog>
        <el-dialog title="选择药房" :visible.sync="pharmacyGet" v-if="pharmacyGet" :modal="false" top="40%">
            <pharmacy-list-multiple @SelectPHARMACY="SelectPHARMACY">
            </pharmacy-list-multiple>
        </el-dialog>
        <el-dialog title="选择急救中心" :visible.sync="SAMUGet" v-if="SAMUGet" :modal="false"  top="60%">
            <SAMU-list-multiple @SelectSAMU="SelectSAMU" >
            </SAMU-list-multiple>
        </el-dialog>
    </el-card>
</template>

<script>
import api from "@/js/api";
import getid from "@/js/getid";
import doctorList from "@/components/System/Doctor/List";
import hospitalList from "@/components/System/Hospital/List";
import PharmacyList from "@/components/System/Pharmacy/List";
import SAMUList from "@/components/System/SAMU/List";
import doctorListMultiple from "@/components/System/Doctor/ListMultiple";
import hospitalListMultiple from "@/components/System/Hospital/ListMultiple";
import PharmacyListMultiple from "@/components/System/Pharmacy/ListMultiple";
import SAMUListMultiple from "@/components/System/SAMU/ListMultiple";
export default {
  data() {
    return {
      formInline: {
        SCHOOL_ID: "",
        SCHOOL_NAME: "",
        SCHOOL_CITY: "",
        SCHOOL_WEB: "",
        SCHOOL_ADDRESS: "",
        SCHOOL_EMIAL: "",
        SCHOOL_TEL: "",
        SCHOOL_PRODUCE: "",
        SCHOOL_REQUIRE: "",
        SCHOOL_CONTENT: "",
        SCHOOL_DOC: "",
        DOCTOR: [],
        HOSPITAL: [],
        SAMU: [],
        PHARMACY: []
      },
      options4: [],
      value9: [],
      list: [],
      loading: false,
      hospitalGet: false,
      doctorGet: false,
      pharmacyGet: false,
      SAMUGet: false
    };
  },
  components: {
    "doctor-list": doctorList,
    "hospital-list": hospitalList,
    "pharmacy-list": PharmacyList,
    "SAMU-list": SAMUList,
    "doctor-list-multiple": doctorListMultiple,
    "hospital-list-multiple": hospitalListMultiple,
    "pharmacy-list-multiple": PharmacyListMultiple,
    "SAMU-list-multiple": SAMUListMultiple
  },
  props: {
    type: {
      type: String,
      default: ""
    },
    Id: {
      type: String,
      default: ""
    }
  },
  methods: {
    SAMUChoose() {
      this.SAMUGet = true;
    },
    doctorChoose() {
      this.doctorGet = true;
    },
    hospitalChoose() {
      this.hospitalGet = true;
    },
    pharmacyChoose() {
      this.pharmacyGet = true;
    },
    //选择医生
    SelectDoctor(data) {
      this.formInline.DOCTOR = this.DateCompute(
        this.formInline.DOCTOR,
        data,
        "DOCTOR_ID"
      );
      this.$refs.doctorList.changeDate(this.formInline.DOCTOR);
      this.doctorGet = false;
    },
    //删除医生
    goDelectDoctor(id) {
      var data = this.formInline.DOCTOR;
      for (let i = 0; i < data.length; i++) {
        if (data[i].DOCTOR_ID == id) {
          this.formInline.DOCTOR.splice(i, 1);
          break;
        }
      }
      this.$refs.doctorList.changeDate(data);
    },
    //
    SelectHospital(data) {
      this.formInline.HOSPITAL = this.DateCompute(
        this.formInline.HOSPITAL,
        data,
        "HOSPITAL_ID"
      );
      this.$refs.hospitalList.changeDate(this.formInline.HOSPITAL);
      this.hospitalGet = false;
    },
    goDelectHospital(id) {
      var data = this.formInline.HOSPITAL;
      for (let i = 0; i < data.length; i++) {
        if (data[i].HOSPITAL_ID == id) {
          this.formInline.HOSPITAL.splice(i, 1);
          break;
        }
      }
  
      this.$refs.hospitalList.changeDate(data);
    },
    //SelectPHARMACY
    SelectPHARMACY(data) {
      this.formInline.PHARMACY = this.DateCompute(
        this.formInline.PHARMACY,
        data,
        "PHARMACY_ID"
      );
      this.$refs.PharmacyList.changeDate(this.formInline.PHARMACY);
      this.pharmacyGet = false;
    },
    goDelectPharmacy(id) {
      var data = this.formInline.PHARMACY;
      for (let i = 0; i < data.length; i++) {
        if (data[i].PHARMACY_ID == id) {
          this.formInline.PHARMACY.splice(i, 1);
          break;
        }
      }
      this.$refs.PharmacyList.changeDate(data);
    },
    //SelectSAMU
    SelectSAMU(data) {
   
      this.formInline.SAMU = this.DateCompute(
        this.formInline.SAMU,
        data,
        "SAMU_ID"
      );
      this.$refs.SAMUList.changeDate(this.formInline.SAMU);
      this.SAMUGet = false;
    },
    goDelectSamu(id) {
      let that = this;
      var data = that.formInline.SAMU;
      for (let i = 0; i < data.length; i++) {
        if (data[i].SAMU_ID == id) {
          that.formInline.SAMU.splice(i, 1);
          break;
        }
      }
      that.$refs.SAMUList.changeDate(data);
    },
    upload(event) {
      let file = event.target.files[0];
      if (file) {
        const formData = new FormData();
        formData.append("file", file);
        let that = this;
        api.uploadFile(this, formData, function(msg) {
          document.getElementById("fileup").value = "";
          that.formInline.SCHOOL_DOC = msg.Result.FilesList[0];
        
        });
      }
    },
    download() {
      window.open(api.download(this.formInline.SCHOOL_DOC));
    },
    //增加方法
    onAdd() {
      this.formInline.SCHOOL_ID = getid.getid();
      api.schoolAdd(this, this.formInline);
    },
    //修改
    onChange() {
      api.schoolUpdate(this, this.formInline);
    },

    //数据合并方法
    DateCompute(arr1, arr2, name) {
      //先去重
      for (var i = 0; i < arr1.length; i++) {
        for (var j = 0; j < arr2.length; j++) {
          if (arr1[i][name] === arr2[j][name]) {
            arr1.splice(i, 1); //利用splice函数删除元素，从第i个位置，截取长度为1的元素
          }
        }
      }
 
      //在合并
      for (var i = 0; i < arr2.length; i++) {
        arr1.push(arr2[i]);
      }
      return arr1;
    },
    getDate() {
      let that = this;
      api.schoolGetone(that, { Id: that.Id }, function(msg) {
        that.formInline = msg.Result;
        that.$refs.doctorList.changeDate(that.formInline.DOCTOR);
        that.$refs.hospitalList.changeDate(that.formInline.HOSPITAL);
        that.$refs.PharmacyList.changeDate(that.formInline.PHARMACY);
        that.$refs.SAMUList.changeDate(that.formInline.SAMU);
      });
    }
  },
  created() {
    if (this.type == "修改") {
      this.getDate();
    }
  }
};
</script>

<style>

</style>
